<%--
  Created by IntelliJ IDEA.
  User: xlro
  Date: 2021/4/22
  Time: 18:17
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<%@ page import="com.xlro.service.UserService" %>
<%@ page import="com.xlro.domain.User" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>--%>
<head>
    <meta charset="utf-8">
    <title>1</title>
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="jQuery/css/htmleaf-demo.css">
    <link rel="stylesheet" href="jQuery/css/style.css"/>
    <style>

        #top-image {
            background: linear-gradient(
                    rgba(0, 0, 0, 0.2),
                    rgba(0, 0, 0, 0.2)
            ), url('jQuery/images/1.jpg') no-repeat fixed;
            position:fixed ;
            top:0;
            width:100%;
            z-index:0;
            height:100%;
        }

        html, body {
            font-size: 14px;
            width: 100%;
            height: 100%;
            color: #fff;
            text-shadow: 0 0 0 #000;
        }
        .login-layout {
            position: absolute;
            width: 96%;
            left: 50%;
            top: 50%;
            border-radius: .75rem;
            transform: translate(-50%, -50%);
            background: rgba(255,255,255, 0.2);
            padding: 100px 80px 80px 50px;
            backdrop-filter: blur(10px);
            display: flex;
            justify-content: center;

        }

        .layui-input{
            background-color: rgba(255,255,255, 0.3);
            border: 0;
        }

    </style>
</head>
<body>

<%@include file="alert.jsp"%>

<%
    String username = (String) session.getAttribute("username");
//    out.print(username);
    UserService us = new UserService();
    User user = us.getUser(username);
    session.setAttribute("user",user);
//    out.print(user.getEmail());
%>

<div id="top-image">
    <div class="login">
        <div class="login-layout">

            <div class="layui-card" style="position:relative;left: -100px;width: 40%;background: rgba(255,255,255, 0);">
                <div class="layui-card-header">个人资料</div>
                <div class="layui-card-body">

                    <form class="layui-form" method="post" action="/alterSelf">
                        <p>用户ID</p> <input name="attributes" readonly class="layui-input" type="text" value="<% out.print(user.getId()); %>">
                        <p>用户名</p> <input readonly name="attributes" class="layui-input" type="text"  value="<%out.print(user.getUsername()); %>">
                        <p>昵称</p> <input  name="attributes" class="layui-input" type="text"  value="<%out.print(user.getReader()); %>">
                        <p>描述</p> <textarea  name="attributes" style="height: 60px" class="layui-input" value=""><%out.print(user.getDescribe()==null?"保密":user.getDescribe()); %></textarea>
                        <p>手机号</p> <input  name="attributes" class="layui-input" type="text"  value="<%out.print(user.getCellphone()==null?"保密":user.getCellphone()); %>">
                        <p>邮箱</p> <input  name="attributes" class="layui-input" type="text"  value="<%out.print(user.getEmail()==null?"保密":user.getEmail()); %>">
                        <p>性别</p> <input  name="attributes" class="layui-input" type="text"  value="<%out.print(user.getSex()==null?"保密":user.getSex()); %>">
                        <button class="layui-btn layui-btn-radius" lay-submit
                                lay-filter="*" style="width: 88px;margin-top: 16px">提交
                        </button>
                    </form>
                </div>
            </div>


    <div class="layui-card" style="position:relative;left: 0px;width: 20%;background: rgba(255,255,255, 0.001);">
            <div class="layui-card-header" style="text-shadow: #FFFFFF">更改密码</div>
            <div class="layui-card-body">

                <form class="layui-form" method="post" action="/alterPass">
                <li>原本密码</li>
                <input class="layui-input" type="password" name="pass" value="" required>
                <li>新密码</li>
                    <input class="layui-input" type="password" name="pass" value="" required>
                    <li>确认新密码</li>
                <input class="layui-input" name="pass"  type="password" value="" required>
                    <button class="layui-btn layui-btn-radius" lay-submit
                            lay-filter="*" style="width: 100px;margin-top: 16px;">确认修改</button>
                </form>
            </div>
        </div>


        </div>
    </div>
</div>

        <script src="layui/layui.js"></script>
        <script src="jQuery/js/jquery-1.11.0.min.js"></script>
        <script src="jQuery/js/ios-parallax.js"></script>


        <script>
            layui.use('layer', function(){
                var layer = layui.layer;

                layer.config({
                    skin: 'demo-class'
                })

            });


        </script>

        <script type="text/javascript">
            $(document).ready(function() {
                $('#top-image').iosParallax({
                    movementFactor: 500,
                    dampenFactor: 100
                });
            });
        </script>
</body>
</html>